<template>
  <div>
  <el-row :gutter="20">
  <el-col :span="18">
  <div>
  <h3>申请{{Msg.processName}}</h3>
  <div class="leave">
  <img src="@/assets/logo.png" alt="">
  <div><h4>{{Msg.username}}</h4>
  <p>部门：{{Msg.departmentName}}</p>
  <p>入职时间： {{timeOfEntry  | dateFormat}}</p></div>
 
  </div>
   <hr>
   <pre>{{procData}}</pre>
  </div>
  </el-col>
  <el-col :span="6"><div>
   <h4>申请记录</h4>
  </div></el-col>
</el-row>
  </div>
</template>

<script>
import {process} from '@/api/http'
export default {
data() {
    return {
        Msg:[],
        queryInfo:{
      
       body:{
        departmentId:'',
        departmentName	:'',
        procApplyTime:'',
        procCurrNodeUserId:'',
        procCurrNodeUserName:'',
        procData:'',
        procEndTime:'',
        processDefinitionId:'',
        processId:this.$route.query.id,
        processKey:'',
        processName:'',
        processState:'',
        timeOfEntry:'',
        userId:'',
        username:''
       }
      },
      procData:[],
    }
},

methods: {
    async    getProcess(){
     const {data:res} = await process({data:this.queryInfo.body}) 
     console.log('带id',res)
     this.procData = JSON.parse(res.data.rows.procData)
    //  JSON.parse(row.procData)
    //  this.total = res.data.total
    },
},
created() {
    this.getProcess()
   
},
}
</script>

<style lang="less" scoped>
.leave{
padding: 20px;
display: flex;
align-items: center;
img{
    width: 100px;
    height: 100px;
}
h4, p{
    padding: 10px 20px;
}
}
</style>